<%@ page language="java" contentType="text/html; charset=utf-8"
         pageEncoding="utf-8" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Insert title here</title>
    <link rel="stylesheet"
          href="https://cdn.bootcss.com/bootstrap/4.0.0-beta/css/bootstrap.min.css">
    <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://cdn.bootcss.com/popper.js/1.12.5/umd/popper.min.js"></script>
    <script
            src="https://cdn.bootcss.com/bootstrap/4.0.0-beta/js/bootstrap.min.js"></script>
    <link href="css/bootstrap-datetimepicker.min.css" rel="stylesheet"
          media="screen">
    <script type="text/javascript" src="css/bootstrap-datetimepicker.js"></script>
    <style>
        .imgs {
            width: 900px;
            height: 400px;
            background-position: center;
            background-size: cover;
        }
    </style>
</head>
<body background="../img/background1.jpg">
<h2 align="center" style="margin-top: 20px;">网吧管理系统</h2>
<div class="container">
        <div class="col-md-9">
            <div class="container" align="center">
                <form action="<%=request.getContextPath()%>/RegisterController" method="post">
<%--                    form表单中的数据也随同提交到了RegisterController--%>
<%--                    request.getContextPath()解决相对路径的问题，可返回站点的根路径。--%>
                    <table align="center">
                        <tr>
                            <td align="center"><b>用户名:</b></td>
                            <td><input type="text" name="username"
                                       style="margin-left: 50px; margin-top: 10px;"
                                       class="form-control inputclass"></td>
<%--                            去除蓝色边框--%>
                        </tr>
                        <tr>
                            <td align="center"><b>性别</b></td>
                            <td>
                                <input type="radio" name="sex" value="男" style="margin-left: 50px; margin-top: 10px;">男
                                <input type="radio" name="sex" value="女" style="margin-left: 50px; margin-top: 10px;">女
                            </td>
                        </tr>
                        <tr>
                            <td align="center"><b>密码</b></td>
                            <td><input type="password" name="password"
                                       style="margin-left: 50px; margin-top: 10px;"
                                       class="form-control inputclass"></td>
   <%--                            input响应式，bootstrap的css--%>
                        </tr>
                        <tr>
                            <td align="center"><b>生日</b></td>
                            <td><input type="text" name="birthday"
                                       style="margin-left: 50px; margin-top: 10px;"
                                       class="form-control inputclass form_date"></td>
                        </tr>
                        <tr>
                            <td><b>用户类型</b></td>
                            <td>
                                <select name="usertype" style="margin-left: 50px; margin-top: 10px;">
<%--                                    <option value="-1">系统管理员</option>--%>
                                    <option value="1">用户</option>
                                </select>
                            </td>
                        </tr>
                        <tr>
                            <td align="center"><b>手机号:</b></td>
                            <td><input type="text" name="phone"
                                       style="margin-left: 50px; margin-top: 10px;"
                                       class="form-control inputclass"></td>
                        </tr>
                        <tr>
                            <td align="center"><b>邮箱:</b></td>
                            <td><input type="text" name="email"
                                       style="margin-left: 50px; margin-top: 10px;"
                                       class="form-control inputclass"></td>
                        </tr>
                    </table>
                    <button type="submit" style="margin-left: 20px; margin-top: 30px;"
                            class="btn btn-info">确认信息
                    </button>


                </form>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
    $('.form_date').datetimepicker({    //选中的日期会被存放在class为form_date的input里。
        format: 'yyyy-mm-dd',   //格式化想要显示的时间格式
        weekStart: 1,//从星期1开始
        todayBtn: 1,//是否显示'today'按钮
        autoclose: 1,
        todayHighlight: 1,
        startView: 2, //0,从小时视图开始，选时分,1从天视图开始，选时.2从月视图开始，选天,3从年视图开始，选月,4从十年视图开始，选年
        minView: 2,//日期时间选择器所能提供的最精确的时间选择视图,0,从小时视图开始，选时分,1从天视图开始，选时.2从月视图开始，选天,3从年视图开始，选月,4从十年视图开始，选年
        forceParse: 0,
    });
</script>
<%--<jsp:include page="Super_footer.jsp"></jsp:include>--%>
</body>
</html>